<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>测试通信</title>
  </head>
  <body>
    <button id="upload">打开上传</button>
    <button id="seller">打开商户</button>
    <button id="product">打开商品</button>
    <button id="community">打开社区</button>
    <button id="activity">打开营销活动</button>
  </body>
  <script>
    const upload = document.getElementById('upload')
    upload.onclick = () => {
      window.parent.postMessage(
        {
          type: 'upload',
          options: {
            limit: 1,
          },
        },
        '*'
      )
    }

    const product = document.getElementById('product')
    product.onclick = () => {
      window.parent.postMessage(
        {
          type: 'product',
          options: {
            type: 'checkbox',
          },
        },
        '*'
      )
    }

    const community = document.getElementById('community')
    community.onclick = () => {
      window.parent.postMessage(
        {
          type: 'community',
          options: {
            type: 'checkbox',
          },
        },
        '*'
      )
    }
    const seller = document.getElementById('seller')
    seller.onclick = () => {
      window.parent.postMessage(
        {
          type: 'seller',
          options: {
            type: 'radio',
          },
        },
        '*'
      )
    }
    const activity = document.getElementById('activity')
    activity.onclick = () => {
      window.parent.postMessage(
        {
          type: 'activity',
          options: {
            type: 'checkbox',
          },
        },
        '*'
      )
    }
    window.addEventListener('message', ({ data, origin }) => {
      /**看是否需要判断信息来源*/
      console.log(data, origin)
      if (origin == 'http://xpj40szpt.signalpha.cn') {
        const { type, data: sendData } = data
        switch (type) {
          case 'upload':
            console.log('upload')
            console.log(sendData)
            break
          case 'product':
            console.log('product')
            console.log(sendData)
            break
          case 'seller':
            console.log('seller')
            console.log(sendData)
            break
          case 'community':
            console.log('community')
            console.log(sendData)
            break
          case 'activity':
            console.log('activity')
            console.log(sendData)
            break
          default:
            break
        }
      }
    })
  </script>
</html>
